<template>
    <ul class="movies">
        <Movie v-for="movie of movies" :movie="movie" :key="movie.id" />
    </ul>
</template>

<script>
import Movie from './Movie.vue'

export default {
    components: {
        Movie,
    },
    data(){
        return {
            movies : [
                {id:0, title: 'Star Wars3'},
                {id:1, title: 'Blade Runner3'},
            ]
        }
    }
}
</script>

<style scoped>
.movie:not(:last-child){
    padding-bottom: 6px;
    margin-bottom: 6px;
    border-bottom: 1px solid rgba(0,0,0,.1);
}
</style>




